<template>
  <div>
    <h2>App组件</h2>
    <MyDialog>
      <!-- v-slot只能加给template标签，所以必须要有template -->
      <!-- v-slot:title 可以简写成 #title -->
      <template #title>
        <h3>提示</h3>
      </template>
      <template v-slot:content="{ uname, age }">
        <!-- { uname, age } = { uname: 'zs', age: 20 } -->
        <p>你确定要删除吗？{{ uname }} {{ age }}</p>
      </template>
      <!-- 没有被template包裹的内容，都是提供给默认插槽的内容 -->
      <template v-slot:default="{ height, weight }">
        <button>确定{{ height }}</button>
        <button>取消{{ weight }}</button>
      </template>
    </MyDialog>

    <MyDialog></MyDialog>
  </div>
</template>

<script>
import MyDialog from '@/components/MyDialog.vue'
export default {
  components: { MyDialog }
}
</script>

<style></style>
